<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('表格传值给父页面')"/>
    <th:block th:include="include :: layout-latest-css"/>
    <th:block th:include="include :: ztree-css"/>
    <style>
        .fixed-table-toolbar {
            display: none;
        }
    </style>
</head>
<body class="gray-bg">
<div class="ui-layout-west">
    <div class="box box-main">
        <div class="box-header">
            <div class="box-title">
                <i class="fa icon-grid"></i> 组织机构
            </div>

        </div>
        <div class="ui-layout-content">
            <div id="tree" class="ztree"></div>
        </div>
    </div>
</div>

<div class="ui-layout-center">
    <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="user-form">
                    <input type="hidden" id="deptId" name="deptId">
                    <input type="hidden" id="parentId" name="parentId">
                    <div class="select-list">
                        <ul>
                            <!--							<li>-->
                            <!--								登录名称：<input type="text" name="loginName"/>-->
                            <!--							</li>-->
                            <li>
                                用户名称：<input type="text" name="userName"/>
                            </li>
                            <li>
                                手机号码：<input type="text" name="phonenumber"/>
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i
                                        class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="resetPre()"><i
                                        class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>


            <div class="col-sm-12 select-table table-striped">
                <table id="bootstrap-table"></table>
            </div>
        </div>
    </div>
</div>

<th:block th:include="include :: footer"/>
<th:block th:include="include :: layout-latest-js"/>
<th:block th:include="include :: ztree-js"/>
<script th:inline="javascript">
    var editFlag = [[${@permission.hasPermi('system:user:edit')}]];
    var removeFlag = [[${@permission.hasPermi('system:user:remove')}]];
    var resetPwdFlag = [[${@permission.hasPermi('system:user:resetPwd')}]];
    var prefix = ctx + "system/user";

    $(function () {
        var panehHidden = false;
        if ($(this).width() < 769) {
            panehHidden = true;
        }
        $('body').layout({initClosed: panehHidden, west__size: 185});
        // 回到顶部绑定
        if ($.fn.toTop !== undefined) {
            var opt = {
                win: $('.ui-layout-center'),
                doc: $('.ui-layout-center')
            };
            $('#scroll-up').toTop(opt);
        }
        queryUserList();
        queryDeptTree();
    });

    function queryUserList() {
        var options = {
            url: prefix + "/getUserNormalList",
            sortName: "createTime",
            sortOrder: "desc",
            modalName: "用户",
            columns: [{
                field: 'selectItem',
                radio: true
            },
                {
                    field: 'userId',
                    title: '用户ID',
                    visible: false
                },
                // {
                //     field: 'loginName',
                //     title: '登录名称',
                //     sortable: true
                // },
                {
                    field: 'userName',
                    title: '用户名称'
                },
                {
                    field: 'dept.deptName',
                    title: '部门'
                },

                {
                    field: 'phonenumber',
                    title: '手机'
                },

            ]
        };
        $.table.init(options);
    }

    // /* 添加用户-选择用户-提交(子页面调用父页面形式) */
    // function submitHandler(index, layero) {
    //     var rows = $.table.selectFirstColumns();
    //     if (rows.length == 0) {
    //         $.modal.alertWarning("请至少选择一条记录");
    //         return;
    //     }
    //     $.modal.close();
    //     // 父页面的方法
    //     // activeWindow().selectUsers();
    //     // 父页面的变量
    //     activeWindow().$('#userids').html('我是通过方式一来的：' + rows.join());
    // }

    /* 添加用户-选择用户-提交(回调形式-父页面调用子页面) */
    function getSelections() {

        return  $.table.selectFirstColumns();
    }

    $("#bootstrap-table").on("check.bs.table check-all.bs.table uncheck.bs.table uncheck-all.bs.table", function (e, rowsAfter, rowsBefore) {
        var rows = $.common.equals("uncheck-all", e.type) ? rowsBefore : rowsAfter;
        var rowIds = $.table.affectedRowIds(rows);
        $("#rowIds").val(rowIds);
    });

    function queryDeptTree() {
        var url = ctx + "system/user/deptTreeData";
        var options = {
            url: url,
            expandLevel: 2,
            onClick: zOnClick
        };
        $.tree.init(options);

        function zOnClick(event, treeId, treeNode) {
            $("#deptId").val(treeNode.id);
            $("#parentId").val(treeNode.pId);
            $.table.search();
        }
    }

    function resetPre() {
        $.form.reset();

    }


</script>
</body>
</html>